<!--
 * @Author: Xia_cc 978487464@qq.com
 * @Date: 2022-06-10 17:48:25
 * @LastEditors: Xia_cc 978487464@qq.com
 * @LastEditTime: 2022-06-11 11:22:55
 * @FilePath: \vue 小U到家\src\views\Mainpaisongdingdanxiangqin.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<!--  -->
<template>
    <el-container>
        <el-header>
            <div id="footdiv">
                <el-button class="but">返回</el-button>
                <span class="span">订单状态：已完成</span>
            </div>
            <!-- 分割线1 -->
            <el-divider content-position="right"></el-divider>
            <el-descriptions title="" class="yhddxqBig" column="5">
                <el-descriptions-item class="yhxq" label="订单编号" width="100px">{{ yhxqUserName }}</el-descriptions-item>
                <el-descriptions-item class="yhxq" label="用户">{{ yhxqUserTel }}</el-descriptions-item>
                <el-descriptions-item class="yhxq" label="收货人">{{ yhxqUserLastTime }}</el-descriptions-item>
                <el-descriptions-item class="yhxq" label="电话">{{ yhxqDingDanTotal }}</el-descriptions-item>
                <el-descriptions-item class="yhxq" label="收货地址">{{ yhxqDingDanTotal }}</el-descriptions-item>
                <el-descriptions-item class="yhxq" label="配送员" width="100px">{{ yhxqUserName }}</el-descriptions-item>
                <el-descriptions-item class="yhxq" label="配送员电话">{{ yhxqUserTel }}</el-descriptions-item>
                <el-descriptions-item class="yhxq" label="重量">{{ yhxqUserLastTime }}</el-descriptions-item>
                <el-descriptions-item class="yhxq" label="所属街道">{{ yhxqDingDanTotal }}</el-descriptions-item>
                <el-descriptions-item class="yhxq" label="所属站点">{{ yhxqDingDanTotal }}</el-descriptions-item>
            </el-descriptions>
            <!-- 分割线2 -->
            <el-divider content-position="right"></el-divider>
            <el-descriptions class="yhddxqBig" title="购物凭条" :column="5" direction="vertical" colon="false">
                <el-descriptions-item label="" colon="false"><img src="../assets/logo.png"></el-descriptions-item>
                <el-descriptions-item label="" colon="false"><img src="../assets/logo.png"></el-descriptions-item>
                <el-descriptions-item label="收银条台号">18100000000</el-descriptions-item>
                <el-descriptions-item label="流水线">苏州市</el-descriptions-item>
                <el-descriptions-item label="日期"></el-descriptions-item>
            </el-descriptions>
            <!-- 分割线3 -->
            <el-divider content-position="right"></el-divider>
            <h4>订单详情</h4>
            <el-table :data="tableData" border style="width: 641px">
                <el-table-column prop="date" label="商品一级分类" width="180">
                </el-table-column>
                <el-table-column prop="name" label="商品二级分类" width="180">
                </el-table-column>
                <el-table-column prop="address" label="数量" width="280">
                </el-table-column>
            </el-table>
            <!-- <el-divider content-position="right"></el-divider> -->
            <el-descriptions title="" class="yhddxqBig" column="1" labelStyle="margin:10px 0" colon="false">
                <el-descriptions-item class="yhxq" label="箱数" width="100px">{{ yhxqUserName }}</el-descriptions-item>
                <el-descriptions-item class="yhxq" label="重量">{{ yhxqUserTel }}</el-descriptions-item>
                <el-descriptions-item class="yhxq" label="金额">{{ yhxqUserLastTime }}</el-descriptions-item>
                <el-descriptions-item class="yhxq" label="消耗箱子">{{ yhxqUserLastTime }}</el-descriptions-item>
                <el-descriptions-item class="yhxq" label="站点派送时间" width="100px">{{ yhxqUserName }}</el-descriptions-item>
                <el-descriptions-item class="yhxq" label="配送员取货时间">{{ yhxqUserTel }}</el-descriptions-item>
                <el-descriptions-item class="yhxq" label="配送员完成时间">{{ yhxqUserLastTime }}</el-descriptions-item>
                <el-descriptions-item class="yhxq" label="签收失败">{{ yhxqUserLastTime }}</el-descriptions-item>
            </el-descriptions>
        </el-header>
    </el-container>
</template>

<script>
export default {
    name: 'paisongdingdanxiangqin',
    components: {
    },
    computed: {},
    data() {
        return {
             tableData: [{
          date: '2016-05-02',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }, {
          date: '2016-05-04',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1517 弄'
        }]
        }
    },
    methods: {}
}
</script>

<style lang='less' scoped>
#footdiv {
    overflow: hidden;
    height: 50px;

    .but {
        float: left;
        display: block;
        margin: 10px 0;
        width: 100px;
        // height: 50px;
        // line-height: 40px;
    }

    .span {
        float: right;
        display: block;
        margin: 10px 0;
        width: 150px;
        height: 50px;
        line-height: 50px;
    }
}
/* .yhddxqBig {
    width: 90%;
    margin: 30px 5%;
} */
</style>
